<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script>
      /* 
        事件：
         一般指的是HTML事件，发生在html元素上的“事情”
         例如：按钮点击了  鼠标悬浮到元素上 输入框失去光标...
         学习事件：
            事件绑定：发生什么事件做什么事情
            常用事件：具体有哪些常见的会发生的事情
       
            在标签上绑定需要执行的功能
            <button onclick="test()">事件绑定</button>

            获得元素对象为对象绑定事件和执行的功能
            对象.xxx=function(){
                js代码
            }
            其中xxx叫做事件名 一般都是on开头的 如 onclick 
       */

      function test() {
        alert("hello");
      }

      //当文档加载完毕后才会执行的事件(完档加载完成事件)
      window.onload = function () {
        var btn = document.querySelector("#btn");
        //当btn按钮对象单击的时候执行函数的操作
        btn.onclick = function () {
          alert("hello01");
        };
      };
    </script>
  </head>
  <body>
    <button onclick="test()">事件绑定</button>
    <button id="btn">事件绑定</button>
  </body>
</html>
